第 2 步 - 应用模糊效果

这一步骤中，您使用渲染通道在两个通道应用定向高斯模糊效果，首先在水平通道，然后是垂直通道。当您在两个通道中应用高斯模糊效果时，会减少着色器采样所需的像素数。例如，对于内核为 9 x 9 像素的高斯模糊，使用两个渲染通道渲染时，着色器只需要对水平轴上的 9 个像素进行采样，对垂直轴上的 9 个像素进行采样，而不需要对 81 像素进行采样。

在您应用定向高斯模糊效果后，再重新应用相同的效果两次，让模糊效果更明显。

要应用模糊效果：

1. 在素材库 (Library) > 渲染 (Rendering) 中按下 Alt 并右键点击渲染通道 (Render Passes)，选择组渲染通道 (Group Render Pass) 并命名为 Gaussian Blur。
   组渲染通道 (Group Render Pass) 允许您收集渲染通道，以便您可以在 场景 (Scene) 或 2D 视口 (Viewport 2D) 节点中引用单个渲染通道。
   使用渲染通道收集在这个过程中创建的多个渲染通道，合并后会产生模糊效果。
   
2. 在素材库 (Library) > 渲染 (Rendering) > 渲染通道 (Render Passes) > Gaussian Blur 中创建渲染到纹理通道 (Render to Texture Pass) 渲染通道。
   渲染到纹理通道 (Render to Texture Pass) 会创建您渲染到纹理时所需的渲染通道和纹理。
   使用渲染通道将汽车 (car) 场景 (Scene) 节点渲染为纹理。
   
   
3. 在素材库 (Library) > 材质和纹理 (Materials and Textures) > 纹理 (Textures) 中选择渲染目标纹理 (Render Target Texture) 纹理，在属性 (Properties) 中设置：
   • 宽度 (Width) 为 256
   • 高度 (Height) 为 256
   让纹理更小，以提高表现力。因为使用该纹理显示模糊的内容，不必精确渲染内容的每个像素。
   
4. 在工程 (Project) 中选择RootPage > 汽车 (Car) > 汽车 (car) 节点，并在属性 (Properties) 中将渲染通道 (Render Pass) 属性设为Gaussian Blur。
   Kanzi Studio 使用Gaussian Blur 渲染通道渲染汽车 (car) 场景 (Scene) 节点。Gaussian Blur 渲染通道渲染汽车 (car) 场景 (Scene) 节点为 渲染目标纹理 (Render Target Texture)，这就是为什么预览 (Preview) 不显示任何内容。
   
5. 在素材库 (Library) > 渲染 (Rendering) > 渲染通道 (Render Passes) > Gaussian Blur 中创建位块传送渲染通道 (Blit Render Pass)，将其命名为 Blit Show 并在属性 (Properties) 中将Texture0 属性设置为渲染目标纹理 (Render Target Texture)。
   位块传送渲染通道 (Blit Render Pass) 使用某种特定材质在屏幕上位块传送一个或多个渲染通道或纹理。
   使用渲染通道在屏幕上绘制渲染目标纹理 (Render Target Texture)。
   Kanzi 以较差质量渲染汽车，因为渲染目标纹理 (Render Target Texture) 纹理尺寸仅 256 x 256 像素。
   
   
6. 在素材库 (Library) > 渲染 (Rendering) > 渲染通道 (Render Passes) > Gaussian Blur 中创建组渲染通道 (Group Render Pass)，将其命名为 Blur Pass 1，并拖动到Blit Show 渲染通道之上。
   使用渲染通道应用定向高斯模糊效果。在这个过程的后续步骤中，再次应用相同的效果，让模糊效果更明显。
   
7. 在水平方向应用模糊效果：
   1. 在素材库 (Library) > 渲染 (Rendering) > 渲染通道 (Render Passes) > Gaussian Blur > Blur Pass 1 中创建合成目标渲染通道 (Composition Target Render Pass) 并将其命名为 Horizontal Blur。
      您使用渲染通道在水平方向应用模糊效果。
      
   2. 在Horizontal Blur 渲染通道中创建清除渲染通道 (Clear Render Pass)，在属性 (Properties) 中添加清除颜色 (Clear Color) 属性，并设置：
      • 亮度 (Lightness) 为 0
      • 阿尔法通道 (Alpha) 为 0
      通过这种方式，您通过透明的黑色清除颜色缓冲区。
      
   3. 在Horizontal Blur 渲染通道中创建位块传送渲染通道 (Blit Render Pass)，将其命名为 Blit Horizontal Blur，并在属性 (Properties) 中将Texture0 属性设置为 渲染到纹理通道 (Render to Texture Pass) 渲染通道。
      您使用本渲染通道在屏幕上绘制渲染到纹理通道 (Render to Texture Pass) 渲染通道，由它渲染汽车 (car) 节点。
      
   4. 在素材库 (Library) 中选择Horizontal Blur 渲染通道，在属性 (Properties) 中添加合成目标 (Composition Target) 属性，将其设置为渲染目标纹理 (Render Target Texture) 纹理。
      使用渲染通道将渲染到纹理通道 (Render to Texture Pass) 渲染为渲染目标纹理 (Render Target Texture) 资源。
      
   5. 在素材库 (Library) 中选择渲染到纹理通道 (Render to Texture Pass)，在属性 (Properties) 中右键点击合成目标 (Composition Target) 属性并选择移除 (Remove)。
      移除属性，因为Blit Horizontal Blur 渲染通道绘制渲染到纹理通道 (Render to Texture Pass)，并且Horizontal Blur 将Blit Horizontal Blur 渲染通道渲染为渲染目标纹理 (Render Target Texture)。
      
   6. 在素材库 (Library) 中选择Blit Horizontal Blur 渲染通道并在属性 (Properties) 中添加和设置：
      • 材质 (Material) 为DirectionalBlurMaterial
      • Blur Direction X 属性字段为 1
        这样可在水平方向应用模糊效果。
      • Blur Radius 为 2.5
        这样可以设置模糊效果的强度。
      您使用渲染通道以 DirectionalBlurMaterial 材质绘制渲染到纹理通道 (Render to Texture Pass)，以在水平方向为汽车 (car) 节点应用高斯模糊效果。
      
      
8. 为水平和垂直模糊创建单独的渲染目标纹理 (Render Target Texture) 纹理：
   1. 在素材库 (Library) > 材质和纹理 (Materials and Textures) > 纹理 (Textures) 中选择渲染目标纹理 (Render Target Texture)，按下 F2 键并将纹理重命名为 Vertical Blur Target。
      
   2. 在素材库 (Library) > 材质和纹理 (Materials and Textures) > 纹理 (Textures) 中选择 Vertical Blur Target，按下 Ctrl D 以复制资源，按下 F2 键，将纹理重命名为 Horizontal Blur Target。
      您创建两个渲染目标纹理，将带有水平模糊效果的汽车 (car) 节点渲染为Horizontal Blur Target 纹理，并使用纹理作为另一个渲染通道的输入。渲染通道在垂直方向应用模糊效果，并将输出渲染为Vertical Blur Target 纹理。您使用Blit Show 渲染通道绘制最终模糊的Vertical Blur Target 纹理到屏幕上。
      
9. 在垂直方向应用模糊效果：
   1. 在素材库 (Library) > 渲染 (Rendering) > 渲染通道 (Render Passes) 中复制Blur Pass 1 > Horizontal Blur 渲染通道并将其重命名为 Vertical Blur。
      您使用渲染通道在垂直方向为汽车 (car) 节点应用模糊效果。
      
   2. 在素材库 (Library) 中选择Horizontal Blur 渲染通道，并在属性 (Properties) 中将合成目标 (Composition Target) 属性设置为Horizontal Blur Target。
      您将Horizontal Blur 渲染通道渲染为Horizontal Blur Target 纹理，以便Vertical Blur 渲染通道能使用Horizontal Blur Target 纹理，在垂直方向应用模糊效果，并将结果渲染为Vertical Blur Target 纹理。
      
   3. 在素材库 (Library) 中选择Vertical Blur > Blit Horizontal Blur 渲染通道，在属性 (Properties) 中设置：
      • 名称 (Name) 为Blit Vertical Blur
      • Texture0 为Horizontal Blur Target
      • Blur Direction X 属性字段为 0
      • Blur Direction Y 属性字段为 1
        这样可在垂直方向应用模糊效果。
      您使用渲染通道以DirectionalBlurMaterial 材质绘制Horizontal Blur Target 资源，以在垂直方向为汽车 (car) 节点应用高斯模糊效果。
      
      
10. 让模糊效果更明显：
    1. 在素材库 (Library) 中复制Blur Pass 1 渲染通道，将其重命名为Blur Pass 2，并将其拖动到Blit Show 渲染通道之上。
       您使用渲染通道为已经模糊的汽车 (car) 节点再次应用模糊效果，让模糊效果更明显。
       
    2. 在素材库 (Library) 中选择Blur Pass 2 > Horizontal Blur > Blit Horizontal Blur 渲染通道并在属性 (Properties) 中将Texture0 属性设置为Vertical Blur Target 纹理。
       可以让 Blur Pass 2 渲染通道将已经模糊的 Vertical Blur Target 资源作为其输入，而非平常渲染 汽车 (car) 节点的 渲染到纹理通道 (Render to Texture Pass) 渲染通道。
       
       
    3. 在 素材库 (Library) 中复制Blur Pass 2 渲染通道，将其重命名为Blur Pass 3，并将其拖动到Blit Show 渲染通道之上。
       第三次应用定向模糊效果，使其效果更强。
       
       

另请参阅

要详细了解有关 Kanzi 中渲染通道的信息，请参阅渲染。

打开导航